<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/addBankCard.css">
    <link rel="stylesheet" href="css/mobileSelect.css">
</head>
<body>
    <div id="app">
        <div class="header padding">
            <img src="images/left-jian.png" alt="" @click="backListTo">
            添加银行卡
        </div>
        <div class="item padding">
            <span>姓名</span>
            <input type="text" ref="name" placeholder="请输入姓名" class="names">
        </div>
        <div class="item padding">
            <span>身份证号码</span>
            <input type="text" class="card sfcard" placeholder="请输入身份证号码" ref="cardNum" onkeyup="this.value=this.value.replace(/[^\w\.\/]/ig,'');" maxlength="18">
        </div>
        <div class="item padding">
            <span>银行卡号</span>
            <input type="text" class="card" placeholder="请输入银行卡号" ref="bankNum" onkeyup="this.value=this.value.replace(/[^\d]/g,'');">
        </div>
        <div class="item padding">
            <span>银行卡类型</span>
            <i id="trigger2">请选择</i>
        </div>
        <!--<div class="item padding" v-if="isXin">
            <span>信用卡有效期</span>
            <input type="text" placeholder="例(0828)2028年8月" class="creditNum">
        </div>
        <div class="item padding" v-if="isXin">
            <span>信用卡码</span>
            <input type="text" placeholder="请输入信用卡码" class="cvvNum">
        </div>-->
        <div class="item padding">
            <span>预留手机号</span>
            <input type="text" class="name" placeholder="请输入预留手机号" ref="phone" onkeyup="this.value=this.value.replace(/[^\d]/g,'');">
        </div>
        <div class="item padding">
            <span>所属地区</span>
            <i id="trigger">请选择</i>
        </div>
        <div class="item padding">
            <span>开户行</span>
            <input type="text" class="openingBank" placeholder="请输入开户行">
        </div>
        <div class="item padding">
            <span>银行类型</span>
            <i id="trigger1">请选择</i>
        </div>
        <div class="submits" @click="submit"><span>提交</span></div>
    </div>
</body>
<script src="../../js/common.js"></script>
<script src="js/vue.min.js"></script>
<script src="js/vue-resource.min.js"></script>
<script src="js/mobileSelect.min.js"></script>
<script src="js/city.js"></script>
<script src="js/addBankCard.js"></script>
<script>
    // 计算html的font-size
    function resizeBaseFontSize(){
        var rootHtml = document.documentElement,
            deviceWidth = rootHtml.clientWidth;

        if(deviceWidth > 640){
            deviceWidth = 640;
        }

        rootHtml.style.fontSize = deviceWidth / 7.5 + "px";
    }

    resizeBaseFontSize();

    window.addEventListener("resize", resizeBaseFontSize, false);
    window.addEventListener("orientationchange", resizeBaseFontSize, false);
</script>
</html>
